// 导入必要的模块和组件
import el from '../utils/el';
import box from './box';
import headElement from './headElement';
import bodyElement from './bodyElement';

/**
 * 创建一个表示分数的SVG元素
 * 此函数接收一个分数布局对象，该对象包含了创建SVG元素所需的布局信息
 * 它返回一个SVG元素，该元素表示分数，包括头部、主体和一个外部的框
 *
 * @param {Object} scoreLayout - 分数布局对象，包含外部、内部、头部和主体的布局信息
 * @return {HTMLElement} 一个表示分数的SVG元素
 */
export default function scoreElement(scoreLayout) {
  // 解构分数布局对象，获取内部布局和头部、主体的布局信息
  const { innerLayout, headLayout, bodyLayout } = scoreLayout;

  // 创建并返回一个SVG元素，该元素表示分数
  // SVG元素包含了外部的框、内部的框（注释掉）、头部元素和主体元素
  return el.create('svg', scoreLayout.wh, [
    box(scoreLayout, 'gray'),
    // box(innerLayout, 'blue'),
    headElement(headLayout),
    bodyElement(bodyLayout)
  ]);
}
